import { useEffect, useRef, useState } from 'react';

import {
  sampleSize, //获得随机数
  uniq, //去重
  sortedUniq,//去重并排序
  take, //从0开始获得指定数组
  takeRight,
  max,
  min,
  lastIndexOf,
  orderBy,//排序
  slice//裁剪数组
} from "lodash"
import IndexLocation from './IndexLocation';
import { useModel } from '@umijs/max';
import Red33List from './Red33List';


// 脚手架示例组件
export default({
  max
}:{
  max: number
})=>{
  let {
    allRedBallList,
    allRedBallStrList,
    historyList,
    historyResultStrList,
    historyOddEvenList,
    historyOddEvetTongj
  } = useModel("ballModel")

  let reverseList = historyResultStrList.concat().reverse();

  return (
    <>
      {
        reverseList.map((redBollStr, index)=>{
          let item:any = historyList[redBollStr];
          let cls = ""
          if(item.oddEvenLastIndex === 0){
            cls = "bg-red-600 text-white";
          }

          if(max != undefined){            
            if(index <= reverseList.length - max){//之显示最近几期
              return null;
            }
          }

          return <tr key={index} data-oddeven={item.oddEven}>
                  <td>{item.number.join(" ")}</td>
                  <td>{item.oddEven}</td>
                  <td><span className={cls}>
                      {item.oddEvenLastIndex}
                    </span></td>
                  <td>
                    <Red33List redBall={take(item.number, 6)}></Red33List>
                  </td>
                  <td>
                    <IndexLocation locationIndex={item.locationIndex}></IndexLocation>
                  </td>
                  <td>
                    
                  </td>
                </tr>
        })
      }
    </>
  );
}